<template>
	<view>

		<!-- 搜索栏 -->
		<view class="search-block-father">
			<view class="search-block" style="width: 696rpx;">
				<image class="icon1" src="../../static/search.png" mode="heightFix"></image>
				<input class="search-text"
				type="text"
				v-model="search"
				 confirm-type="search"
				@confirm="getSearch"
				 placeholder="| 求组队,搜经验"
				 placeholder-style="font-size:25rpx;color:#bfbfbf"
				/>
			</view>
		</view>
		<view class="tab">
			<view :class="listIndex ==y?'activite':''" @click="checkListIndex(y)" v-for="(x,y) in navList" :key="y" >
				{{x}}
			</view>
		</view>
	<!-- 	每个tab下的内容 -->
		<view class="content" v-for="(x,y) in navList" :key="y">
			<!-- <view v-if="listIndex==y"> -->
			<view v-if="listIndex==y">
				<view v-if="y==0">
					<view v-for="(item,index) in all0List" :key="index" @click="getdetail(listIndex,index)">
						<tie :reciveAll="item" ></tie>
					</view>
				</view>
				<view v-if="y==1">
					<view v-for="(item,index) in all1List" :key="index" @click="getdetail(listIndex,index)">
						<tie :reciveAll="item" ></tie>
					</view>
				</view>
				<view v-if="y==2">
					<view v-for="(item,index) in all2List" :key="index" @click="getdetail(listIndex,index)">
						<tie :reciveAll="item" ></tie>
					</view>
				</view>
			</view>
		</view>
		<uni-fab
					:pattern="pattern"
					horizontal="right"
					vertical="bottom"
					:popMenu="false"
					@fabClick="fabClick"
				/>
	</view>
</template>

<script>
	import tie from "../../components/tie.vue"
	export default {
		components:{
			tie
		},
		data() {
			return {
				search:"",
				navList:["最新发布","组队互助","干货经验"],
				listIndex:0,
				navIndex:1,
				all0List:[],
				all1List:[],
				all2List:[],
				pattern:{buttonColor:'#666FFC'},
			}
		},
		onShow(){
				//console.log(this.listIndex);
				uni.request({
					url:"https://hotenergy.club/workapp/share/get_all",
					method:"GET",
					data:"",
					success:(res)=>{
						//console.log(res.data);
						this.all0List=res.data;
					},
				}),
				uni.request({
					url:"https://hotenergy.club/workapp/share/get_all_tag1",
					method:"GET",
					data:"",
					success:(res)=>{
						//console.log(res.data);
						this.all1List=res.data;
					},
				}),
				uni.request({
					url:"https://hotenergy.club/workapp/share/get_all_tag2",
					method:"GET",
					data:"",
					success:(res)=>{
						//console.log(res.data);
						this.all2List=res.data;

					},
				})
		},
		created() {
			console.log(this.allList);
		},
		methods: {
			fabClick(){
				uni.navigateTo({
					url:"edit"
				})
			},
			checkIndex(index){//tab全部实习校招
				this.navIndex=index;
			},
			getSearch(){
					console.log("输入搜索",this.search)
					uni.request({
						url:'https://hotenergy.club/workapp/search_share',
						method:"POST",
						data:{
							searchStr:this.search
						},
						success: (res) => {
							console.log('搜索返回',res)
							this.all0List=res.data;
							this.listIndex =0;
							if(this.all0List==''){
								uni.showToast({
									icon:'loading',
									title:'没有该内容'
								})
							}
						}
					})
			},
			checkListIndex(index){
				this.listIndex=index;
			},
			getdetail(navIndex,index){//转到详情页
				console.log('navIndex,index',navIndex,index),
				this.id=index+1;
				//console.log(this.id),
				uni.navigateTo({
					url:'detail?&navIndex='+navIndex+'&index='+index,
				})
			}
		}
	}
</script>

<style>
	page{
		background-color: #F5F5F5;
	}
.search-block{
	position:relative;//定位方式,相对定位
/* 	margin:25rpx 20rpx 20rpx 20rpx;//上右下左 */
	display: flex;//flex容器
	flex-direction: row;//元素按列排
	background-color: #FFFFFF;
	border-radius: 40rpx;  /*15rpx*/
	height: 60rpx;
}
.search-block-father{
	position:relative;//定位方式,相对定位
	margin:0;//上右下左
	padding: 25rpx 27rpx 20rpx 27rpx;;
	display: flex;//flex容器
	flex-direction: row;//元素按列排
	background-color: #666FFC;
	height: 60rpx;
}
.search-text{
	margin-top: 8rpx;
	font-size: 30rpx;
}
.icon1{
	height: 45rpx;
	margin-top: 7rpx;
	margin-left: 10rpx;
	margin-right: 10rpx;
}
.tab{
	margin: 20rpx 40rpx 20rpx 40rpx;
	display: flex;//flex容器
	flex-direction: row;//元素按hang排
	justify-content: space-between;
}
.activite{
	font-weight: bold;
	color: #666FFC;
}


</style>
